<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <title>Blockly</title>
    <link rel="stylesheet" href="DemoTry.css">
    <link rel="stylesheet" href="bootstrap.min.css">
    <script src="../../blockly_compressed.js"></script>
    <script src="../../blocks_compressed.js"></script>
    <script src="../../python_compressed.js"></script>

    <script src="../../msg/js/zh-hans.js"></script>

    <!-- <script src="../../core/field_telecontrol_select.js"></script> -->
    <!-- <script src="../../core/field_tune_select.js"></script> -->
    <!-- <script src="../../core/field_draw.js"></script> -->

    <!-- <script src="core/blockly.js"></script> -->
    <!-- <script src="../../core/block_svg.js"></script> -->
    <!-- <script src="core/function.js"></script> -->
     <!-- <script src="../../core/command.js"></script> -->
     <!-- <script src="../../core/variables.js"></script> -->
     <!-- <script src="../../core/contextmenu.js"></script> -->

    <!-- <script src="../../blocks/mathAndLogicBlock.js"></script> -->
    <!-- <script src="../../blocks/actionBlock.js"></script> -->
    <!-- <script src="../../blocks/controlsBlock.js"></script> -->
    <!-- <script src="../../blocks/functionBlock.js"></script> -->
    <!-- <script src="blocks/blocks.js"></script> -->
    <!-- <script src="../../blocks/procedures.js"></script> -->
    <!-- <script src="../../blocks/variables.js"></script> -->
    <!-- <script src="../../blocks/math.js"></script> -->

    <!-- <script src="../../generators/python/mathAndLogicPython.js"></script> -->
    <!-- <script src="../../generators/python/actionPython.js"></script> -->
    <!-- <script src="../../generators/python/controlsPython.js"></script> -->
    <!-- <script src="../../generators/python/functionPython.js"></script> -->
    
    <style>
        * {
            padding: 0;
            border: 0;
            margin: 0;
        }

        button {
            background-color: transparent;
            outline: none;
        }

        ul {
            list-style: none;
        }

        html {
            font-size: 625%;
        }

        html, body {
            height: 100%;
            margin: 0;
        }
        body {
            background-color: #fff;
            font-family: sans-serif;
            overflow: hidden;
            position: relative;
        }
        h1 {
            font-weight: normal;
            font-size: 140%;
        }
        #blocklyDiv {
            height: 100%;
            background: #fc9;
            text-align: center;
        }

        #generateButton {
            width: 0.4rem;
            height: 0.4rem;
            background-image: url("../../media/res/download.png");
            background-size: 0.4rem 0.4rem;
        }

        #debugButton {
            width: 0.7rem;
            height: 0.7rem;
            background-image: url("../../media/res/run.png");
            background-size: 0.7rem 0.7rem;
        }

        #saveButton {
            width: 0.4rem;
            height: 0.4rem;
            background-image: url("../../media/res/save.png");
            background-size: 0.4rem 0.4rem;
        }

        #listButton {
            width: 0.4rem;
            height: 0.4rem;
            background-image: url("../../media/res/list.png");
            background-size: 0.4rem 0.4rem;
        }

        .serialport {
            position: absolute;
            left: 0.1rem;
            bottom: 0.1rem;
            z-index: 100;
            display: none;
        }
        .serialport button {
            background-color: #4CAF50; /* Green */
            border: none;
            color: white;
            padding: 0.15rem 0.32rem;
            text-align: center;
            text-decoration: none;
            display: block;
            margin-top: 0.08rem;
            font-size: 0.16rem;
            border-radius: 0.04rem;
        }

        #btnSend {
            display: none;
        }

        .disabled {
            background-color: #4CAF50; /* Green */
            opacity: 0.6;
        }

        .abled {
            background-color: #4CAF50; /* Green */
            opacity: 1;
        }

        .menu {
            position: absolute;
            right: 0.1rem;
            top: 0.1rem;
            width: 2.1rem;
            z-index: 100;
        }
        
        .menu a {
            display: block;
            margin-right: 0.05rem;
            float: left;
        }

        .menu a:nth-child(2) {
            margin-top: 0.15rem;
        }

        .menu a:nth-child(3) {
            margin-top: 0.15rem;
        }

        .menu a:nth-child(4) {
            margin-top: 0.15rem;
            margin-right: 0;
        }

        .zoom {
            width: 1.4rem;
            position: absolute;
            bottom: 0.1rem;
            right: 0.1rem;
            z-index: 100;
        }

        .zoom a {
            display: block;
            font-size: 0.4rem;
            color: #ffab40;
            width: 0.4rem;
            height: 0.4rem;
            background-color: white;
            line-height: 0.4rem;
            position: relative;
            float: left;
            margin-right: 0.05rem;
        }

        .zoom a:nth-child(1) {
            border-radius: 0.2rem 0 0 0.2rem;
        }

        .zoom a:nth-child(3) {
            border-radius: 0 0.2rem  0.2rem  0;
        }

        .zoom a:nth-child(1)::after{
            content: "-";
            display: block;
            position: absolute;
            left: 0.13rem;
            top: -0.03rem;
        }

        .zoom a:nth-child(2)::after{
            content: "=";
            display: block;
            position: absolute;
            left: 0.08rem;
            top: -0.03rem;
        }

        .zoom a:nth-child(3)::after{
            content: "+";
            display: block;
            position: absolute;
            left: 0.06rem;
            top: -0.03rem;
        }
        #loading {
            width: 100%;
            height: 100%;
            opacity: 0.6;
            background-color: black;
            z-index: 101;
            position: absolute;
            display: none;
        }
        #loading #loading_container {
            width: 100%;
            height: 100%;
            display: flex;
            align-items: flex-end;
            justify-content: center;
        }

        #loading #loading_container .progress {
            flex-basis: 80%;
            margin-bottom: 1rem;
        }
    </style>
</head>
<body>
<div class="serialport">
    <select id="select_serial">
    </select>
    <button id="btnConnect" type="button">连接</button>
    <button id="btnSend" type="button">发送数据</button>
</div>
<div class="menu">
    <a id="debugButton" class="buttonScale"></a>
    <a id="generateButton" class="buttonScale"></a>
    <a id="saveButton" class="buttonScale"></a>
    <a id="listButton" class="buttonScale"></a>
</div>
<div class="zoom">
        <a id="zoomMinus"></a>
        <a id="zoomEqual"></a>
        <a id="zoomPlus"></a>
</div>
<div id="loading">
    <div id="loading_container">
        <div class="progress">
            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="min-width: 0.5rem; width: 0%">
            </div>
        </div>
    </div>
</div>
<table style="border-spacing: 0;width: 100%;height: 100%;">
    <tr style="height: 100%;">
        <td>
            <div id="blocklyDiv"></div>
        </td>
    </tr>
</table>

<xml id="toolbox" style="display: none">
    <category name="机器人">
        <block type="d_c_generator_roll_with_speed">
            <value name="SPEED">
                <shadow type="math_number">
                    <field name="NUM">0</field>
                </shadow>
            </value>
        </block>
        <block type="turn_on_on_board_light">
            <value name="COLOR_RED">
                <shadow type="math_number">
                    <field name="NUM">0</field>
                </shadow>
            </value>
            <value name="COLOR_GREEN">
                <shadow type="math_number">
                    <field name="NUM">0</field>
                </shadow>
            </value>
            <value name="COLOR_BLUE">
                <shadow type="math_number">
                    <field name="NUM">0</field>
                </shadow>
            </value>
        </block>
        <block type="play_sound_by_beat"></block>
        <block type="screen_show_number">
            <value name="NUMBER">
                <shadow type="math_number">
                    <field name="NUM">0</field>
                </shadow>
            </value>
        </block>
        <block type="screen_show_time">
            <value name="HOUR">
                <shadow type="math_number">
                    <field name="NUM">0</field>
                </shadow>
            </value>
            <value name="MINUTE">
                <shadow type="math_number">
                    <field name="NUM">0</field>
                </shadow>
            </value>
        </block>
        <block type="screen_show_picture">
        </block>
        <block type="ultrasonic"></block>
        <block type="volume"></block>
        <block type="line_patrol"></block>
        <block type="telecontroller"></block>
    </category>
    <category name="流程">
        <block type="start_block"></block>
        <block type="controls_wait">
            <value name="TIME">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
        </block>
        <block type="controls_wait_until"></block>
        <block type="tq_controls_repeat_ext">
            <value name="TIMES">
                <shadow type="math_number">
                    <field name="NUM">10</field>
                </shadow>
            </value>
        </block>
        <block type="controls_repeat_forever"></block>
        <block type="controls_repeat_until"></block>
        <block type="tq_controls_if"></block>
        <block type="tq_controls_ifelse"></block>
    </category>
    <category name="数字">
        <block type="math_arithmetic_add">
            <value name="A">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
            <value name="B">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
        </block>
        <block type="math_arithmetic_minus">
            <value name="A">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
            <value name="B">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
        </block>
        <block type="math_arithmetic_multiply">
            <value name="A">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
            <value name="B">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
        </block>
        <block type="math_arithmetic_divide">
            <value name="A">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
            <value name="B">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
        </block>
        <block type="math_random_int">
            <value name="FROM">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
            <value name="TO">
                <shadow type="math_number">
                    <field name="NUM">100</field>
                </shadow>
            </value>
        </block>
        <block type="logic_compare_gt">
            <value name="A">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
            <value name="B">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
        </block>
        <block type="logic_compare_eq">
                <value name="A">
                    <shadow type="math_number">
                        <field name="NUM">1</field>
                    </shadow>
                </value>
                <value name="B">
                    <shadow type="math_number">
                        <field name="NUM">1</field>
                    </shadow>
                </value>
            </block>
        <block type="logic_compare_lt">
            <value name="A">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
            <value name="B">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
        </block>
        <block type="logic_operation_and"></block>
        <block type="logic_operation_or"></block>
        <block type="logic_negate"></block>
        <block type="math_modulo">
            <value name="DIVIDEND">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
            <value name="DIVISOR">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
        </block>
        <block type="math_round">
            <value name="NUM">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
        </block>
        <block type="math_trig">
            <value name="NUM">
                <shadow type="math_number">
                    <field name="NUM">1</field>
                </shadow>
            </value>
        </block>
    </category>
    <!-- <category name="test">
        <block type="colour_picker"></block>
        <block type="play_sound_by_beat"></block>
    </category> -->
    <!-- <category name="变量" custom="VARIABLE"></category> -->
    <!-- <category name="函数" custom="PROCEDURE"></category> -->
    <category name="新建" custom="COMMAND"></category>
</xml>
<xml id="startBlocks" style="display: none">
        <block x="160" y="10" type="telecontroller"></block>
</xml>
<div id="dialog">
    <div id="dialogBg"></div>
    <div id="cell">
            <!-- <div id="teleController" class="dialog hide">
                    <table cellpadding=0 cellspacing=0 border="0">
                        <tr>
                            <td><button></button></td>
                            <td><button></button></td>
                            <td><button></button></td>
                        </tr>
                        
                    </table>
            </div> -->
        <div id="drawingBoard" class="dialog hide">
                <p class="title">表情面板</p>
                <div class="drawTool">
                    <a id="drawPen">画笔</a>
                    <a id="drawEraser">橡皮擦</a>
                    <a id="drawTrashcan">清除</a>
                </div>
                <ul id="drawContent">
                </ul>
                <button class="btn_close" onclick="DemoApp.hideDialog('drawingBoard')"></button>
                <div class="drawMenu">
                    <a id="drawCancel">取消</a>
                    <a id="drawConfirm">确定</a>
                </div>
        </div>
        <div id="programDialog" class="dialog hide">
            <button id="resetProgram">恢复出场程序</button>
            <button id="newProgram"><img src="../../media/res/add_program.png" alt=""></button>
            <div class="programBox">
                <ul id="programList">
                    <li>
                        <span>文件1</span>
                        <button class="modify_program"><img src="../../media/res/pen.png" alt="" width="40"></button>
                        <button class="delete_program"><img src="../../media/res/trashcan.png" alt="" width="40"></button>
                    </li>
                </ul>
            </div>
            <button class="btn_close" onclick="DemoApp.hideDialog('programDialog')"></button>
        </div>

        <div id="programNameDialog" class="dialog hide">
            <p class="title">请输入名称</p>
            <input id="newProgramName" type="text">
            <a id="addProgram">确定</a>
            <button class="btn_close" onclick="DemoApp.hideDialog('programNameDialog')"></button>
<<<<<<< HEAD
        </div>

        <div id="FunctionNameDialog" class="dialog hide">
            <p class="title">请输入名称</p>
            <input id="newFunctionName" type="text">
            <a id="addFunction">确定</a>
            <button class="close" onclick="DemoApp.hideDialog('FunctionNameDialog')"></button>
        </div>

        <div id="modifyProgramNameDialog" class="dialog hide">
            <p class="title">请输入名称</p>
            <input id="newModifyProgramName" type="text">
            <a id="modifyProgramName">确定</a>
            <button class="btn_close" onclick="DemoApp.hideDialog('modifyProgramNameDialog');DemoApp.showDialog('programDialog');"></button>
=======
>>>>>>> 0408691f30ab10e54f40c5d0995243b2ffc7f174
        </div>
        <div id="commonTip" class="dialog hide">
                <p class="title">提示</p>
                <p class="tipContent"></p>
                <a id="commonTipOk">好的</a>
                <button class="btn_close" onclick="DemoApp.hideDialog('commonTip');"></button>
            </div>
    </div>
</div>
<script src="mobile-detect.min.js"></script>
<script>
'use strict';
(function(_D){
        var _self = {};
        _self.resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
        _self.Html = _D.getElementsByTagName("html")[0];
        _self.widthProportion = function(){
            var p = Number((_D.body&&_D.body.clientWidth||_self.Html.offsetWidth)/720).toFixed(3);
            return p<0.444?0.444:p;
        };
        _self.changePage = function(){
            _self.Html.setAttribute("style","font-size:"+_self.widthProportion()*100+"px");
            _self.correctPx();
        };
        _self.correctPx = function(){
            var docEl = document.documentElement;
            var clientWidth = docEl.clientWidth;
            // console.log(clientWidth)
            if (!clientWidth || clientWidth > 768) return;
            var div = document.createElement('div');
            div.style.width = '1.4rem';
            div.style.height = '0';
            document.body.appendChild(div);
            var ideal = 140 * clientWidth / 720;
            var rmd = (div.clientWidth / ideal);
            // console.log(rmd);
            if(rmd > 1.2 || rmd < 0.8){
                docEl.style.fontSize = 100 * (clientWidth / 720) / rmd + 'px';
                document.body.removeChild(div);
            }

        };
        _self.changePage();
        if (!document.addEventListener) return;
        window.addEventListener(_self.resizeEvt,_self.changePage,false);
        document.addEventListener('DOMContentLoaded', _self.changePage, false);
})(document);

    var p = Number((document.body&&document.body.clientWidth)/720).toFixed(3);
    window.clientZoom = p<0.444?0.444:p;
    var md = new MobileDetect(window.navigator.userAgent);
    window.os = md.os();

    var buttonScales = document.getElementsByClassName("buttonScale");
    for(let i=0; i<buttonScales.length; i++) {
        buttonScales[i].addEventListener("touchstart", function(){
            this.className = "buttonScale buttonsStart";
        })

        buttonScales[i].addEventListener("touchend", function(){
            this.className = "buttonScale buttonsEnd";
        })

        buttonScales[i].addEventListener("touchcancel", function(){
            this.className = "buttonScale buttonsEnd";
        })
    }
</script>
<script>
    if (window.os !== "iOS" && window.os !== "AndroidOS") {
        // 重命名 Electron 提供的 require
        window.nodeRequire = require;
        delete window.require;
        delete window.exports;
        delete window.module;
    }
<<<<<<< HEAD
=======
</script>
<script src="jquery-3.3.1.min.js"></script>
<script src="bootstrap.min.js"></script>
<script src="DemoTry.js">
>>>>>>> 0408691f30ab10e54f40c5d0995243b2ffc7f174
</script>
<script src="jquery-3.3.1.min.js"></script>
<script src="bootstrap.min.js"></script>
<script src="DemoTry.js"></script>
</body>
</html>